<template>
	<div>
		<div class="user-header">
			<div class="userinfo">
				<div class='user-img'>
					<open-data type="userAvatarUrl" class="userinfo-avatar"></open-data>      
				</div> 
				<text class="userinfo-nickname" v-if="user">{{user.name}}</text>
				<text class="userinfo-nickname" v-if="!user">未绑定</text>
				<text class='role-name' v-if="jname"><text>{{jname}}</text></text>
			</div>
		</div>

		<div class='user-link'>

			<view v-if="isDali" style='padding:0' class='daili-box' >
				<view v-if="leagueList.length" @click='gojm(2)' >
					<image mode='widthFix' src='../../../static/images/jm.png' style='width:42rpx;height:42rpx;'></image> 
					<text>{{pageText.jm}}</text>
				</view>
				<view v-if="partnerList.length" @click='gojm(3)'>
					<image mode='widthFix' src='../../../static/images/hz.png' style='width:42rpx;height:42rpx;'></image> 
					<text>{{pageText.hz}}</text>
				</view>
				<view  v-if="contractorList.length" @click='gojm(4)'>
					<image mode='widthFix' src='../../../static/images/cb.png' style='width:42rpx;height:42rpx;'></image> 
					<text>{{pageText.cb}}</text>
				</view>
			</view>
			<view bindtap='myCoffee'><image mode='widthFix' src='../../../static/images/coffee.png' style='width:42rpx;height:42rpx;'></image><text>{{pageText.kf}}</text></view>
			<view bindtap='about'><image mode='widthFix' src='../../../static/images/about.png' style='width:42rpx;height:42rpx;'></image><text>{{pageText.gy}}</text></view>
			<view bindtap='jBind' @click='jbind'><image mode='widthFix' src='../../../static/images/jb.png' style='width:42rpx;height:42rpx;'></image> <text>{{pageText.jc}}</text></view>

		</div>

		<view class='more'>
			<view>{{pageText.lj}}</view>
			<view>http://vip.kayuanwang.cn</view>
		</view>

	</div>
</template>
<script type="text/javascript">
	import {get} from '../../utils/index'
	
	export default{
		data(){
			return{
				user:{},
				isDali:true,
				jname:'',
				leagueList:[],//加盟商列表
			  partnerList:[],//合作商数据列表 
			  contractorList:[],//承包商合作列表
				pageText:{
			        'lj':'了解咖缘吧更多信息',
			        'jm':'我的加盟商',
			        'hz':'我的合作商',
			        'cb':'我的承包商',
			        'kf':'我的咖啡机',
			        'gy':'关于我们',
			        'jc':'解除绑定',
			        'jgt':'警告',
			        'jg':'解除绑定后，将无法看到您的数据，需要重新绑定'

			    }
			}
		},
		methods:{
			async getLeague(style){

				console.log(style)
				var datas = {
					limit: 9999,
			        offset: 0,
			        parent: wx.getStorageSync('userDo').id,
			        type: style,
			        tfont: wx.getStorageSync('userDo').font
				}

				var list  = await get('getAgentListByAgentId',datas);
				return  list
				

			},

			async getDatas(){
				this.leagueList =  await this.getLeague(2);
				this.partnerList =  await this.getLeague(3);
				this.contractorList =  await this.getLeague(4);
				
			},
			gojm(idx){
				wx.navigateTo({
			      url: '/pages/jm/main?stype='+idx,
			     
			    })
			},
			
			jbind(){
				var that  = this;


				wx.showModal({
				 title: that.pageText.jgt,
				 content: that.pageText.jg,
					 success:function(res){
							 if (res.confirm){
									 that.relieveBindAgent();
							 }
					 }
				})
			},
			
			
			relieveBindAgent(){
				var user = wx.getStorageSync('userDo');
				get('relieveBindAgent',{id: user.id}).then( res =>{
					if(res.code == 500){
						 wx.showToast({
									title: res.data.msg,
									icon: 'none'
							})
					}else if(res.code == 0){
						wx.removeStorageSync('userDo')
						wx.showToast({
								title: "操作成功！"
						})
						setTimeout(function () {
								wx.switchTab({
										url: '/pages/home/main',
								})
						}, 1000)
					}
				})
			
			}
		},
		mounted(){
			this.user = wx.getStorageSync('userDo');
			this.isDali = this.user.type == 1 ? true : false
			var n = ''
			if(this.user.type == 1){
				n ='代理商'
			}else if(this.user.type == 2){
				n = '加盟商'
			}else if(this.user.type == 3){
				n = '合作商'
			}else{
				n = '承包商'
			}
			this.jname = n;

			this.getDatas();


		}
		
	}
</script>

<style>
.user-header{
    background: #333;
    padding: 60rpx 0;
}
.userinfo {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.user-img{
  width: 128rpx;
  height: 128rpx;
   border-radius: 50%;
   overflow: hidden;
   position: relative;
}
.userinfo-avatar {
  width: 128rpx;
  height: 128rpx;
  margin: 20rpx auto 20rpx auto;
 
  border-radius: 50%;
  position: absolute;
  left: 0rpx;top: -19rpx;
}
.userinfo-nickname {
  color: #fff;
  font-size: 26rpx;
  margin-top: 10rpx;
}
.userinfo-date{
    font-size: 24rpx;
    color: #fff;
    margin-top: 10rpx;
}
.user-link{
   background: #fff;
    font-size: 26rpx;
    line-height:80rpx;
    color: #515151;
}
.user-link view{
    border-bottom: 2rpx solid #ccc;
    padding: 0 20rpx;
}
.daili-box view:last-child{
  border: 0;
}
.user-link view text{
    padding-left: 20rpx;
}
.user-link image{
    vertical-align: middle;
    margin-top: -4rpx;
}
.role-name{
  font-size: 22rpx;
  text-align: center;
  padding-top: 14rpx;
}
.role-name text{
  border: 2rpx solid red;
  border-radius: 10rpx;
  padding: 2rpx 8rpx;
  color: red;
}

.more{
position:absolute;
bottom:20rpx;
text-align:center;
width:100%;
font-size:24rpx;

}


</style>